<!doctype html>
<html lang="en">	
	<head>
		<meta charset="UTF-8">
		<meta name="Generator" content="EditPlus®">
		<meta name="Author" content="">
		<meta name="Keywords" content="">
		<meta name="Description" content="">
		<title>13-定位none</title>
		<link rel="stylesheet" href="../css/node-public.css">
	</head>
	<body>
		
		<div id="box">
			<h1>13-定位none</h1>
			<a href="../confused is Blog/confused is Blog.html">首页</a>
		</div>
		<div id="main-box">
			<ul>
				<li>
					<h2>定位</h2>
					<span>能够任意设置元素的位置
			定位元素的层级默认会比浮动高
			定位元素的层级默认在文档流里的元素高
		</span>
				</li>
				<li>
					<h2>定位元素</h2>
					<span>定位元素有上下的堆叠顺序
			后面的默认比前面的要高
		
		position   定位属性
			absolute  绝对定位

			方位值：
				top   距离参考对象的上边的值

		绝对定位元素：
			1、脱离文档流
			2、不给方位值的时候，默认会在原始位置飞起
			3、在不给参考对象的时候，默认的参考对象是body
					</span>
				</li>
				<li>
					<h2>绝对定位元素</h2>
					<span>1、脱离文档流
			2、不给方位值的时候，默认会在原始位置飞起
			3、在不给参考对象的时候，默认的参考对象是body
			做定位元素参考对象必须满足的条件：
				1、absolute的参考对象只能是absolute、relative、fixed
				2、必须是直系父级
				3、必须是除了static以外定位元素
			会一直往上寻找参考对象，如果不符合条件，会继续往上找，
			直到找到body。
			判断是不是定位元素，看他的position属性

			绝对定位会让元素变成块级
			如果不定义宽高，默认会由内容撑开宽高
		</span>
				</li>
				<li>
					<h2>position relative</h2>
					<span>相对定位，只相对于自己
			1、不改变元素的类型
			2、不给方位值的时候还存在文档流里面
			3、如果给了方位值，原本在文档流里的空间会保留，移动的地方不存在于文档流了
		一般会配合绝对定位使用

		方位值：只有定位元素才会生效
			top
			bottom
			right
			left
		
		定位元素对margin:0 auto；会失效
	-->
		</span>
				</li>
				<li>
					<h2>position fixed </h2>
					<span>固定定位
			参考对象永远是窗口
		</span>
				</li>
				<li>
					<h2>z-index</h2>
					<span>设置定位元素的层级
			同级定位元素，默认后面的比前面的层级要高
			如果不是同级定位元素，不能直接比较层级，找你们能比较的定位元素的父级来比
	-->
		</span>
				</li>
			</ul>
	</body>
</html>
